<%@page import="org.proddevplm.dao.data.activities.Activity"%>
<%@page import="org.proddevplm.dao.data.User"%>
<%@page import="org.proddevplm.constants.UserConstants"%>
<%@page import="org.proddevplm.constants.ControllerConstants"%>
<%@page import="org.proddevplm.dao.data.Roles"%>
<%@page import="org.proddevplm.dao.data.Project"%>
<%@page import="org.proddevplm.dao.data.RelationMatrix"%>
<%@page import="java.util.List"%>

<%
	String currentRole = "";
	List relMatrixUser = (List)session.getAttribute("relMatrixUser");
	int projectId = (Integer)session.getAttribute("projectId");
	for (int index=0; index<relMatrixUser.size(); index++){
		RelationMatrix rm = (RelationMatrix)relMatrixUser.get(index);
		Project userProject = rm.getProject();
		if(userProject.getId()==projectId){
			Roles userRole = rm.getRole();
			currentRole = userRole.getRole();
		}
	}
	List allActivities = (List)session.getAttribute("allActivities");
	User user = (User)session.getAttribute(UserConstants.USER);
%>

<script>
	var flag = false;
	<%if(allActivities.size()!=0)%> flag = true;
		
	function loadWSPage(page){
		$("#workingArea").load(page);
	}
	
	function loadWSPageWithReq(request, page) {
        $.post(request, function(data) {
            $("#workingArea").load(page);
        });
    }
	
	function loadCRPageWithReq(request, page) {
        $.post(request, function(data) {
            $("#showReport").load(page);
        });
    }
	
	$(function(){
		$( "#dialog:ui-dialog" ).dialog( "destroy" );
		$( "button" ).button();
		
		$('.helpImg').mouseover(function () {
		    $(this).css("cursor", "pointer");
		 });

		$('.helpImg').mouseout(function () {
		    $(this).css("cursor","default");	    
		 });
		
		
		
		$("#allActivitiesTable")
			.tablesorter({
				widgets: ['zebra'],
				sortList: [[4,0]]
			})
			.tablesorterPager({
				container: $("#allActivitiesPager")
				})
			.tablesorterFilter({
				filterContainer: "#allActivitiesFilter-box",
	        	filterClearContainer: "#allActivitiesFilter-clear-button",
	            filterCaseSensitive:false,
	            filterColumns: [1,2,3,4,5,6,7]
			})
		
		if(flag){
			$("#toDoTable")
				.tablesorter({
			       	widthFixed: true,
			       	debug:false,
			       	widgets: ['zebra'],
					headers: {
			       		7 : {sorter: false}
			       	},
			       	sortList: [[3,0]]
			    })
			  
				.tablesorterPager({container: $("#toDoPager")})
				.tablesorterFilter({filterContainer: "#toDoFilter-box",
		            		filterClearContainer: "#toDoFilter-clear-button",
		                    filterCaseSensitive:false,
		                    filterColumns: [1,4,5,6],
					})
					
			$("#toReviewTable")
				.tablesorter({
					widthFixed:true,
					debug:false,
					widgets: ['zebra'],
					headers: {
						7 : {sorter:false}
					},
					sortList: [[3,0]]
				})
				
				.tablesorterPager({container: $("#toReviewPager")})
				.tablesorterFilter({filterContainer: "#toRevFilter-box",
			                filterClearContainer: "#toRevFilter-clear-button",
			                filterCaseSensitive:false,
			                filterColumns: [1,4,5,6]
					})
			}
	}); 
	
	function goToTool(request, page){
		$("#tab5").click();
		//imi trebuie ceva similar cu un wait(1000)
		var timerId=window.setInterval(function() {
			loadWSPageWithReq(request, page);
			window.clearInterval(timerId);
		}, 1000);
				
	}
	
	function addResComment(name, i){
		var id = 'actResComm'+i;
		var comment = document.getElementById(id).value;
		var arguments = "activityName="+name+"&comment="+comment;
		ajaxCall("activityManager", "3", arguments, null);
	}
	
	function addAprComment(name, i){
		var id = 'actAprComm'+i;
		var comment = document.getElementById(id).value;
		var arguments = "activityName="+name+"&comment="+comment;
		ajaxCall("activityManager", "3", arguments, null);
	}
	
	function showChanges(name){
				
		var arguments = "activityName="+name;
		ajaxCall("dataAccessManager", "25", arguments, populateCRSelect);
		
	}
	
	function populateCRSelect(data){
		var array = data.split("~");
		var optionSet = "";
		optionSet+="<option SELECTED>-Please select an option-</option>";
		for(var i=0; i<array.length; i++){
			var aux = array[i].split("&xkw&");
			optionSet+="<option value=\""+aux[1]+"\">"+aux[0]+"</option>";
		}
		
		$("#chooseChange").html(optionSet);
		
		$( "#changesDialog" ).dialog({
			height: 320,
			width: 500,
			modal: true
		})
	}
	
	function getCRPage(){
		var id = document.getElementById('chooseChange').value;
		loadCRPageWithReq("/proddev/controller?manager=dataAccessManager&method=26&id="+id, "content/project/devTools/workspace/changes/showChangeReport.jsp");
	}
	
</script>

<div style="font-family:verdana; font-size:medium; color:#2A2A2A; ; text-align:center; margin-top:20px; margin-bottom:20px">Activities on the project</div>

<div align="center">

<%if (!currentRole.equals("Project Manager")){ %>
	<div style="width:auto">
		
		<div >
			<b>To do list</b>
		</div>
		
		<div style="width:100%">
			<div style="float:right; margin-bottom:-10px; text-align:right; ">
				Search table: <input name="filter" id="toDoFilter-box" value="" maxlength="30" size="30" type="text" style="background-color:#E6EEEE">
				<input id="toDoFilter-clear-button" type="submit" value="Clear" style="background-color:#E6EEEE;"/>
			</div>
			<div style="clear:both;"></div>
			<table id="toDoTable" class="tablesorter" style="width:100%" rules="rows" frame="hsides" bordercolor="#DBDBDB" >
				<thead>
					<tr>
						<th>Activity</th>
						<th>Approver</th>
						<th>Start date</th>
						<th>End date</th>
						<th>Comments</th>
						<th>Status</th>
						<th>Tool</th>
						<th>Action</th>
					</tr>
				</thead>
				
				<tbody>
					<%
					for(int i=0; i<allActivities.size(); i++) {
						Activity activity = (Activity)allActivities.get(i);
						if(!(((activity.getResponsible().equals(currentRole))||(activity.getResponsible().equals("All roles")))&&(activity.getApprover().equals(currentRole)))){
						if((activity.getResponsible().equals(currentRole))||(activity.getResponsible().equals("All roles"))){
						%>
							<tr>
								<td style="width:25%">
									<div style="float:left"><%=activity.getName()%></div>
									<%if(activity.getActivityLifeCycle().equals("Rejected")) {%>
										<img class="helpImg" src="/proddev/images/exclamation.png" onclick="showChanges('<%=activity.getName()%>')" style="float:right">
									<%} %>
								</td>
								<td style="width:15%"><%=activity.getApprover() %></td>
								<td style="width:8%"><%=activity.getStartDate() %></td>
								<td style="width:8%"><%=activity.getEndDate() %></td>
								<td >
									<input id="actResComm<%=i %>" <%if(activity.getComments()==null){ %>value="Insert comment here" <%}else{ %>value="<%=activity.getComments() %>" <%}%> style="float:left; width:90%; border:none; background:none"/>
									<img class="helpImg" src="/proddev/images/accept.png" onclick="addResComment('<%=activity.getName()%>', '<%=i%>')" height="20" style="width:10%; float:left">
								</td>
								<td style="width:8%"><%=activity.getActivityLifeCycle() %></td>
								<td style="width:10%"><%=activity.getToolName() %></td>
								<td style="width:5%; text-align:center;">
									<%String parameter = activity.getToolControlString();
									String[] array = parameter.split("~");
									String req = "/proddev/controller?"+array[0]+"&"+array[1];
									String pag = array[2];
									if(!((activity.getActivityLifeCycle().equals("Approved"))||(activity.getActivityLifeCycle().equals("Under review")))){%>
										<img class="helpImg" src="/proddev/images/tool.png" width="20" height="20" onclick="goToTool('<%=req%>','<%=pag%>')" />
									<%} %>
									<%if(!((activity.getFilePath()==null)||(activity.getFilePath().equals("")))) {
										String address = "ftp://"+activity.getFilePath();%>
										<a href="<%=address %>"><img src="/proddev/images/readMe.png" width="20" height="20" style="border:0px"/></a>
									<%} %>
									<!-- <button id="goToTool" name="goToTool" onclick="goToTool('<%=req%>','<%=pag%>')" style="width:100%; font-size:xx-small">Use tool</button> -->
								</td>
							</tr>			
						<%} }
					}%>
				</tbody>
			
			</table>
			
			<div id="toDoPager" class="pager" style="float:right; margin-top:-10px">
				<form>
					<img src="/proddev/images/tablePager/first.png" class="first" width="20" height="20" />
					<img src="/proddev/images/tablePager/previous.png" class="prev" width="20" height="20" />
					<input type="text" class="pagedisplay" style="text-align:center; width:40px; height:20px; background-color:#E6EEEE"/>
					<img src="/proddev/images/tablePager/next.png" class="next" width="20" height="20" />
					<img src="/proddev/images/tablePager/last.png" class="last" width="20" height="20" />
					<select class="pagesize" style="height:20px;">
						<option SELECTED value="5">set paging</option>
						<option value="5">5 per page</option>
						<option value="10">10 per page</option>
						<option value="20">20 per page</option>
						<option value="30">30 per page</option>					
					</select>
				</form>
			</div>
			
			<div id="changesDialog" title="View proposed changes" style="display:none">
				<select class="regInput" id="chooseChange" onchange="getCRPage()" style="width:100%"></select>
				<div id="showReport" style="width:100%; margin-top:10px"></div>
				<div style="clear:both"></div>
			</div>
			
			<div style="clear:both"></div>
		</div>
		
		<div style="margin-top:20px;">
			<b>List of tasks to review</b>
		</div>
		
		<div style="width:100%">
			<div style="float:right; margin-bottom:-10px; text-align:right; ">
				Search table: <input name="filter" id="toRevFilter-box" value="" maxlength="30" size="30" type="text" style="background-color:#E6EEEE">
				<input id="toRevFilter-clear-button" type="submit" value="Clear" style="background-color:#E6EEEE;"/>
			</div>
			<div style="clear:both;"></div>
			<table id="toReviewTable" class="tablesorter"  style="width:100%" rules="rows" frame="hsides" bordercolor="#DBDBDB">
			
				<thead>
					<tr>
						<th>Activity</th>
						<th>Responsible</th>
						<th>Start date</th>
						<th>End date</th>
						<th>Comments</th>
						<th>Status</th>
						<th>Tool</th>
						<th>Action</th>
					</tr>
				</thead>
				
				<tbody>
					<%
					for(int i=0; i<allActivities.size(); i++) {
						Activity activity = (Activity)allActivities.get(i);
						if(activity.getApprover().equals(currentRole)){
						%>
							<tr>
								<td style="width:25%"><%=activity.getName() %></td>
								<td style="width:15%"><%=activity.getResponsible() %></td>
								<td style="width:8%"><%=activity.getStartDate() %></td>
								<td style="width:8%"><%=activity.getEndDate() %></td>
								<td >
									<input id="actAprComm<%=i %>" <%if(activity.getComments()==null){ %>value="Insert comment here" <%}else{ %>value="<%=activity.getComments() %>" <%} %> style="float:left; width:90%; border:none;background:none"/>
									<img class="helpImg" src="/proddev/images/accept.png" onclick="addAprComment('<%=activity.getName()%>', '<%=i%>')" height="20" style="width:10%; float:left">
								</td>
								<td style="width:8%"><%=activity.getActivityLifeCycle() %></td>
								<td style="width:10%"><%=activity.getToolName() %></td>
								<td style="width:5%; text-align:center;">
									<%String parameter = activity.getToolControlString();
									String[] array = parameter.split("~");
									String req = "/proddev/controller?"+array[0]+"&"+array[1]+"&activityName="+activity.getName();
									String pag = array[2];
									if("Under review".equals(activity.getActivityLifeCycle())){%>
										<img class="helpImg" src="/proddev/images/tool.png" width="20" height="20" onclick="goToTool('<%=req%>','<%=pag%>')" />
									<%} %>
									<%if(!((activity.getFilePath()==null)||(activity.getFilePath().equals("")))) {
										String address = "ftp://"+activity.getFilePath();%>
										<a href="<%=address %>"><img src="/proddev/images/readMe.png" width="20" height="20" style="border:0px"/></a>
									<%} %>
								</td>
							</tr>			
						<%} 
					}%>
				</tbody>
			
			</table>
		
			<div id="toReviewPager" class="pager" style="float:right; margin-top:-10px">
				<form>
					<img src="/proddev/images/tablePager/first.png" class="first" width="20" height="20" />
					<img src="/proddev/images/tablePager/previous.png" class="prev" width="20" height="20" />
					<input type="text" class="pagedisplay" style="text-align:center; width:40px; height:20px; background-color:#E6EEEE"/>
					<img src="/proddev/images/tablePager/next.png" class="next" width="20" height="20" />
					<img src="/proddev/images/tablePager/last.png" class="last" width="20" height="20" />
					<select class="pagesize" style="height:20px;">
						<option SELECTED value="5">set paging</option>
						<option value="5">5 per page</option>
						<option value="10">10 per page</option>
						<option value="20">20 per page</option>
						<option value="30">30 per page</option>					
					</select>
				</form>
			</div>	
			<div style="clear:both;"></div>
		</div>
	
	</div>
<%}else{ %>
	<div style="width:auto">
		<div style="float:right; margin-bottom:-10px; text-align:right; ">
			Search table: <input name="filter" id="allActivitiesFilter-box" value="" maxlength="30" size="30" type="text" style="background-color:#E6EEEE">
			<input id="allActivitiesFilter-clear-button" type="submit" value="Clear" style="background-color:#E6EEEE;"/>
		</div>
		<div style="clear:both;"></div>
		<table id="allActivitiesTable" class="tablesorter" style="width:100%" rules="rows" frame="hsides" bordercolor="#DBDBDB" >
			<thead>
				<tr>
					<th>Activity</th>
					<th>Responsible</th>
					<th>Approver</th>
					<th>Start date</th>
					<th>End date</th>
					<th>Comments</th>
					<th>Status</th>
				</tr>
			</thead>
			<tbody>
				<%for(int i=0; i<allActivities.size(); i++){
					Activity activity = (Activity)allActivities.get(i);%>
					<tr>
						<td style="width:25%"><%=activity.getName() %></td>
						<td style="width:15%"><%=activity.getResponsible() %></td>
						<td style="width:15%"><%=activity.getApprover() %></td>
						<td style="width:8%"><%=activity.getStartDate() %></td>
						<td style="width:8%"><%=activity.getEndDate() %></td>
						<td ><%=activity.getComments() %></td>
						<td style="width:8%"><%=activity.getActivityLifeCycle() %></td>
					</tr>
				<%} %>
			</tbody>
		</table>
		<div id="allActivitiesPager" class="pager" style="float:right; margin-top:-10px">
			<form>
				<img src="/proddev/images/tablePager/first.png" class="first" width="20" height="20" />
				<img src="/proddev/images/tablePager/previous.png" class="prev" width="20" height="20" />
				<input type="text" class="pagedisplay" style="text-align:center; width:40px; height:20px; background-color:#E6EEEE"/>
				<img src="/proddev/images/tablePager/next.png" class="next" width="20" height="20" />
				<img src="/proddev/images/tablePager/last.png" class="last" width="20" height="20" />
				<select class="pagesize" style="height:20px;">
					<option SELECTED value="5">set paging</option>
					<option value="5">5 per page</option>
					<option value="10">10 per page</option>
					<option value="20">20 per page</option>
					<option value="30">30 per page</option>					
				</select>
			</form>
		</div>	
	</div>

<%} %>
</div>